import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs';
import { argTypesView } from "./helpers/helpers";

export const podStatusDocs= { source: { code: `podStatus := component.NewPodStatus()`}}

export const statusText = {
  config: {
    value: '',
  },
  metadata: {
    type: 'text',
  },
};

export const podStatusView = {
  "metadata": {"type": "podStatus"},
  "config": {
    "pods": {
      "pod-57466fd965-xprw9": {
        "details": [statusText], "status": "ok"
      }
    }
  }
};

export const PodStatusStoryTemplate = args => ({
  template: `<app-pod-status [view]= "view"></app-pod-status>`,
  argTypes: argTypesView,
  props: { view: args.view },
});

<h1>Pod Status component</h1>
<h2>Description</h2>
<p>
    It's a pod status
</p>
<h2>Example</h2>

<Meta title="Components/Pod Status" argTypes = { argTypesView } />

<Canvas withToolbar>
  <Story name="Pod Status component"
         parameters={{ docs: podStatusDocs }}
         args= {{ view: podStatusView, }}>
    { PodStatusStoryTemplate.bind({}) }
  </Story>
</Canvas>

<h2>Props</h2>
<ArgsTable story = "Pod Status component" />
